import React, {Component} from 'react';
import './index.css';
import {Modal, Button} from 'antd';
import Util from '../util';

/**
 * ie浏览器兼容性提示
 */
class IeTips extends Component {

    constructor(props) {
        super(props);

        this.state = {
            visible: false,
        };
    }

    componentDidMount() {
        this.setState({
            visible: Util.browser().msie
        })
    }

    render() {
        return (
            <Modal
                visible={this.state.visible}
                title="使用体验提醒"
                footer={null}
                onCancel={() => {
                    this.setState({
                        visible: false
                    })
                }}
            >
                <div class="ieTips">
                    <p className="ieTips__content">
                        为了更好的使用体验，请使用
                        <div className="ieTips__red ieTips__chrome">谷歌浏览器</div>
                        或 <span className="ieTips__bold">双核浏览器的</span><span className="ieTips__red">极速模式</span><br/>
                        <img className="ieTips__img" src="http://cdn2.taojinzi.com/xcx/admin/imgs/jisu.jpg" />
                    </p>

                    <Button onClick={() => {
                        this.setState({
                            visible: false
                        })
                    }} type="primary" size="large">好的，我知道了</Button>
                </div>
            </Modal>
        );
    }
}

export default IeTips;
